<%@ page language="java" contentType="text/html;charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="java.util.*"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>换房页面</title>
<style>
.text{
	background:rgb(167, 216, 243);
}
.text1{
	background:rgb(199, 234, 236);
}
</style>
</head>
<body>
	<div align="center"><h1>客户换房</h1></div> 
	<div class="mainDiv">
		<div>
		<form action="user/changeroom.action" id="form" method="POST">
		<input type="hidden" name="sRoomName" value="${sRoomName }" id="hidden_sRoomName"/>
			<table style="width:200px; position: fixed; top: 30%; left: 25%" border="1" >
				<tr>
					<td colspan="2">
					<select id="sRoomName" onchange="changeRoom('select')">
						<option value="">请选择入住的房间</option>
						<c:forEach items="${userList }" var ="item">
							<option value="${item.sRoomName }">${item.sRoomName }</option>
						</c:forEach>
					</select>
					</td>
				</tr>
				<tr>
					<td>房间</td>
					<td id="changeRoom">${changeUser.sRoomName }</td>
				</tr>
				<tr>
					<td>姓名</td>
					<td id="sUserName">${changeUser.sUserName }</td>
				</tr>
				<tr>
					<td>身份证</td>
					<td id="sIDCard">${changeUser.sIDCard }</td>
				</tr>
				<tr>
					<td>电话</td>
					<td id="sTel">${changeUser.sTel }</td>
				</tr>
				<tr>
					<td>性别</td>
					<td id="sSex">${changeUser.sSex }</td>
				</tr>
				<tr>
					<td>可用房间</td>
					<td>
						<select id="usableRoom">
							<c:forEach items="${usableList }" var="item">
								<c:if test="${item.iStatus == -1 }">
									<option value="${item.sRoomName }"/>${item.sRoomName }
								</c:if>
							</c:forEach>
						</select>
					</td>
				</tr>
				<tr>
					<td colspan="2" align="center"><input type="button" value="确认换房" class="text" onclick="confirm()"/></td>
				</tr>
			</table>
		</form>
		</div>
	</div>
</body>
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
<script type="text/javascript">
function changeRoom(str){
	var sRoomName = $("#hidden_sRoomName").val();
	if(str == "select"){
		sRoomName = $("#sRoomName").val();
	}
	else {
		return false;
	}
	$("#hidden_sRoomName").val(sRoomName);
	document.getElementById("form").submit();
}
function confirm(){
	var changeRoom = document.getElementById('changeRoom').innerText;
	var sUserName = document.getElementById('sUserName').innerText;
	var sIDCard = document.getElementById('sIDCard').innerText;
	var sTel = document.getElementById('sTel').innerText;
	var sSex = document.getElementById('sSex').innerText;
	var sRoomName = $("#usableRoom").val();
	window.location = "user/confirm.action?sUserName="+sUserName+"&sIDCard="
			+sIDCard+"&sTel="+sTel+"&sSex="+sSex+"&sRoomName="+sRoomName+"&changeRoom="+changeRoom;
}
</script>
</html>